<template>
	<div>
		<van-nav-bar title="登录" left-text="返回" right-text="注册" left-arrow @click-left="onClickLeft" @click-right="onClickRight" />
		<h3>账号登录</h3>
		<van-form @submit="onSubmit" style="margin-top: 30px;">
			<van-field v-model="phone" label="手机号" placeholder="手机号" :rules="[{ required: true, message: '请填写手机号' }]" />
			<van-field v-model="password" type="password" label="密码" placeholder="密码" :rules="[{ required: true, message: '请填写密码' }]" />
			<div style="margin: 16px;">
				<van-button round block type="info" native-type="submit">提交</van-button>
			</div>
		</van-form>
	</div>
</template>

<script>
	import {
		Dialog,
		Notify
	} from 'vant';

	export default {
		data() {
			return {
				phone: 'test1',
				password: '123'
			}
		},
		methods: {
			onSubmit() {
				this.$axios({
					method: 'post',
					url: '/logreg/login',
					data: this.$qs.stringify({
						phone: this.phone,
						password: this.password
					})
				}).then((resp) => {
					if (resp.data.status == 200) {
						var user = resp.data.obj;
						//1s为1秒，1min为1分钟，1h为1小时，1d为1天，字符均忽略大小写
						this.$cookies.set("user", user, "1d");
						Notify({
							type: 'success',
							message: '登录成功'
						})
						this.$router.replace('/me')
					} else {
						Dialog.alert({
							message: '账号不正确或密码错误'
						})
						this.phone = "";
						this.password = "";
					}
				})
			},
			onClickLeft() {
				console.log("返回")
				this.$router.back()
			},
			onClickRight() {
				console.log("注册")
				this.$router.push('/register')
			}
		}
	}
</script>

<style scoped>
</style>
